
<!doctype html>
<html ng-app="RatEmployerApp">
<head>
    <meta charset="utf-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="css/bootstrap.gantt.css">
    <link rel="stylesheet" href="css/gantt.css"/>
    <title>Project Employer Booking</title>
</head>
<body style="padding: 10px">

<div ng-controller="bookController">
    <h1>Project Employer Booking</h1>

    <form role="form" class="form-inline">
        <div class="form-group">
            <span class="help-block">Action</span>
            <div class="btn-group">
                <button class="btn btn-default" ng-click="addSamples()">Load data</button>
                <button class="btn btn-default" ng-click="removeSomeSamples()">Remove some</button>
                <button class="btn btn-default" ng-click="removeSamples()">Remove all</button>
            </div>
        </div>
        <div class="form-group">
            <span class="help-block">View scale</span>
            <select class="form-control" style="width: 100px;" ng-model="scale" ng-options="s for s in ['hour', 'day', 'week', 'month']"></select>
        </div>
        <div class="form-group">
            <span class="help-block">Sort order</span>
            <select class="form-control" style="width: 100px;" ng-model="mode" ng-options="m for m in ['name', 'date', 'custom']"></select>
        </div>
        <div class="form-group text-center">
            <span class="help-block">Max height</span>
            <div ng-show="maxHeight > 0">
                <button class="btn btn-default" ng-click="maxHeight = 0">Deactivate</button>
            </div>
            <div ng-show="maxHeight === 0">
                <button class="btn btn-default" ng-click="maxHeight = 300">Activate</button>
            </div>
        </div>
        <div class="form-group text-center">
            <span class="help-block">Additional options</span>
            <div class="btn-group">
                <button ng-show="showWeekends" class="btn btn-default" ng-click="showWeekends = false">Hide weekends</button>
                <button ng-show="showWeekends == false" class="btn btn-default" ng-click="showWeekends = true">Show weekends</button>
                <button ng-show="showNonWorkHours == false" class="btn btn-default" ng-click="showNonWorkHours = true; subScale = 6">Show non working hours</button>
                <button ng-show="showNonWorkHours" class="btn btn-default" ng-click="showNonWorkHours = false; subScale = 8">Hide non working hours</button>
            </div>
        </div>
    </form>
    <hr>
    <gantt first-day-of-week="1"
           load-data="loadData = fn"
           remove-data="removeData = fn"
           clear-data="clearData = fn"
           sort-mode="mode"
           view-scale="scale"
           column-width="scale === 'month' && 20 || (scale === 'week' && 10 || 4)"
           column-sub-scale="scale === 'week' && 7 || 6"
           work-hours="[8,9,10,11,12,13,14,15]"
           show-non-work-hours="showNonWorkHours"
           weekend-days="[0,6]"
           show-weekends="showWeekends"
           max-height="maxHeight"
           on-gantt-ready="addSamples()"
           on-label-clicked="labelEvent(event)"
           on-label-dbl-clicked="labelEvent(event)"
           on-label-context-clicked="labelEvent(event)"
           on-label-header-clicked="labelHeaderEvent(event)"
           on-label-header-dbl-clicked="labelHeaderEvent(event)"
           on-label-header-context-clicked="labelHeaderEvent(event)"
           on-row-added="rowEvent(event)"
           on-row-clicked="rowEvent(event)"
           on-row-dbl-clicked="rowEvent(event)"
           on-row-context-clicked="rowEvent(event)"
           on-row-updated="rowEvent(event)"
           on-scroll="scrollEvent(event)"
           on-task-clicked="taskEvent(event)"
           on-task-dbl-clicked="taskEvent(event)"
           on-task-context-clicked="taskEvent(event)"
           on-task-updated="taskEvent(event)">
    </gantt>
    <hr>
    
</div>

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.18/angular.js"></script>
  <script src="js/rat.js"></script>
<script src="lib/angular-gantt/assets/demo_sample_data.js"></script>
<script src="js/modules/employer/controller.js"></script>
<script src="lib/angular-gantt/assets/angular-gantt.js"></script>
</body>
</html>